<template>
  <el-dialog title="已推送信息" :visible.sync="dialogShow" width="60%">
    <el-table :data="formData" border stripe>
      <el-table-column
        prop="class_name"
        width="200px"
        label="班级名称"
      ></el-table-column>
      <el-table-column prop="exam_time_start" label="考试状态">
        <template slot-scope="{ row }">
          <div>
            <span style="color: #409eff">主考：</span
            ><span>{{
              row.exam_time_start
                ? "待考试 | " +
                  new Date(row.exam_time_start)
                    .toLocaleDateString()
                    .replace(/\//g, "-")
                : "待设定时间"
            }}</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column align="center" width="150px" label="操作">
        <template slot-scope="{ row }">
          <el-button type="text" @click="btnOk(row)">解除绑定</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer">
      <el-button type="primary" @click="dialogShow = false">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { formatTime } from "@/filters";
import { getBindClassApi } from "@/api/exam";
export default {
  name: "banExam",
  data() {
    return {
      dialogShow: false,
      formData: {},
    };
  },
  methods: {
    async btnOk(text) {
      try {
        await this.$confirm("确认解绑吗？");
      } catch (error) {
        return console.log(error);
      }
      await getBindClassApi({
        del: true,
        class_id: text.class_id,
        exam_id: text.exam_id,
      });
      this.$message.success("解绑成功");
      this.$emit("updateList");
      this.dialogShow = false;
    },
  },
};
</script>

<style></style>
